<template>
    <div class="jrHumanConfirmMoney">
        <van-nav-bar
                title="确认"
                left-text="返回"
                left-arrow
                border
                fixed
                @click-left="$router.go(-1)"
        />
        <div style="height:50px"></div>
        <van-cell-group>
            <van-field v-model="info.balance" label="客户当前费用结余" placeholder="" disabled size="large"/>
            <van-field v-model="info.price" label="本次投保费用总额" placeholder="" disabled size="large"/>
            <van-field v-model="info.invoice_price" label="本次开票金额" placeholder=""  size="large"/>
            <van-field v-model="info.money" label="本次实收款金额" placeholder="" size="large" required/>
        </van-cell-group>
        <div class="up-img">
            <div><span style="color: red;">*</span>打款凭证上传</div>
            <van-uploader v-model="business_license" multiple :max-count="1" :after-read="afterRead" :name="1">
                <img class="up-icon" src="../../../assets/img/money_evidence.png" alt="">
            </van-uploader>
        </div>
        <div class="foot-btn">
            <div class="blue-btn" @click="save">保存</div>
            <div class="red-btn" @click="$router.go(-1)">取消</div>
        </div>
    </div>
</template>

<script>
    export default {
        name: "jrESConfirmMoney",
        data() {
            return {
                business_license: [], //营业执照
                qiniuToken: '',
                info: {
                    balance: '',
                    price: '',
                    money: '',
                    annex: '',
                    invoice_price: '',
                }
            };
        },
        methods: {
            infoData() {
                let params = {
                    token: localStorage.getItem('token'),
                    wx_member_id: localStorage.getItem('wx_member_id'),
                    member_goods_id: this.$route.query.id,
                }
                this.$post("/api/Finance/confirm_settlement", params)
                    .then(res => {
                        this.info = res.data
                    })
                    .catch(err => {
                    });
            },
            getQiniuToken() {
                this.$post("/api/qiniu/up_token", {})
                    .then(res => {
                        this.qiniuToken = res
                    })
                    .catch(err => {
                    });

            },
            afterRead(file) {
                this.$Toast.loading({
                    message: '上传中',
                    duration: 0,
                    forbidClick: true
                });
                this.$QiniuUpload(this.qiniuToken, file)
                    .then(res => {
                        this.$Toast.clear();
                        this.business_license = [
                            {url: this.qiniuToken.domain + res.key},
                        ]
                        this.info.annex = this.qiniuToken.domain + res.key
                    })
                    .catch(err => {
                        this.$Toast.clear();
                    });

            },
            save() {
                let params = {
                    token: localStorage.getItem('token'),
                    wx_member_id: localStorage.getItem('wx_member_id'),
                    member_goods_id: this.$route.query.id,
                    member_id: this.info.member_id,
                    money: this.info.money,
                    annex: this.info.annex,
                    cate_id: this.info.cate_id,
                    invoice_price: this.info.invoice_price,
                }
                this.$post("/api/Finance/confirm_settlement_save", params)
                    .then(res => {
                        this.$Toast(res.msg);
                        if (res.code == 1) {
                            this.$router.go(-1)
                        }
                    })
            },
        },
        created() {
            // 实例创建完成
            this.infoData();
            this.getQiniuToken()
        },
        beforeCreate() {
            document.querySelector("body").setAttribute("style", "background-color:#fff");
        }
    }
</script>

<style scoped lang='less'>
    .up-img {
        height: 120px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        color: #333;
        font-size: 13px;
        padding-right: 15px;
        margin-bottom: 15px;

        > div:nth-of-type(1) {
            margin-left: 13px;
            margin-right: 22px;
        }

        .up-icon {
            width: 57vw;
            height: 112px;
        }
    }

    .foot-btn {
        padding-bottom: 80px;
        display: flex;
        justify-content: center;
        align-items: center;
        margin-top: 32px;
    }
</style>